<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="AAuto" /> 
<title>选项控件</title>
<link href="../style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="maincontent">
<h1>选项控件</h1>
 <div class="desc">参考:<a href="../libraries/std/web/html.html"></a> <a href="webform.html">创建web窗体</a> <a href="html.html#dom">什么是DOM</a> <a href="ele.html">ele节点属性和方法</a> <a href="getele.html">使用web窗体获取ele对象</a></div>
 <div>
   <h2>复选框<a name="checkbox" id="checkbox"></a></h2>
  <p>一个复选框如下:    <br />
  <pre><input type="checkbox" name="checkbox2" id="checkbox2" /> <label for="checkbox2">这是复选框</label></pre>
  </p>
  <p>HTML源码如下:</p>
  <pre>&lt;input type=&quot;checkbox&quot; name=&quot;checkbox&quot; id=&quot;checkbox&quot; /&gt;</pre>
  <p>控制复选框是否选中.</p>
  </p>
  <pre>//复选框
ele = wb.getEle(&quot;checkbox&quot;)
ele.checked = true;</pre>
</div>
<div>
  <h2>单选框<a name="radio" id="checkbox3"></a></h2>
  <p>一个单选框如下: <br />
  </p>
  <pre><input type="radio" name="radio" id="radio1" /> <label for="checkbox4">这是单选框</label><input type="radio" name="radio" id="radio2" /> <label for="checkbox4">这是单选框2</label></pre>
  </p>
  <p>HTML源码如下:</p>
  <pre>&lt;input type=&quot;radio&quot; name=&quot;radio&quot; id=&quot;radio1&quot; /&gt;
&lt;input type=&quot;radio&quot; name=&quot;radio&quot; id=&quot;radio2&quot; /&gt;</pre>
  <p>单选框通常有多个,并且名字相同,而ID不同,使用  <a href="getele.html#getEles">wb.getEles</a> 函数可以返回所有同名单选控件的com对象数组.<br />
  改变选定状态与复选框类似,即改变checked属性.</p>
  </p>
  <pre>//单选框
ele = wb.getEles(&quot;radio&quot;)
ele(0).checked = true;</pre>
</div>
<div>
  <h2>下拉选框</h2>
  <p>一个单选框如下: <br />
</p>
  <pre><select name="select" id="select" onchange="alert('我被改变了')">
  <option value="值">选项</option>
  <option value="值2">选项2</option>
</select>
  </pre>
  </p>
  <p>HTML源码如下:</p>
  <pre>&lt;select name=&quot;select&quot; id=&quot;select&quot; onchange=&quot;alert('我被改变了')&quot;&gt;
  &lt;option value=&quot;值&quot;&gt;选项&lt;/option&gt;
  &lt;option value=&quot;值2&quot;&gt;选项2&lt;/option&gt;
&lt;/select&gt;</pre>
  <p>下拉选框有一个父节点select,然后有一系列的option选项节点.<br />
    web.form库提供wb.select函数以改变选项.
</p>
  <br />
  <br />
  <br />
  <strong>1、函数原型：</strong></p>
  <pre>ele =  wb.select(&quot;选项控件名&quot;, 查找参数,框架名)</pre>
  <p><strong>2、函数说明：</strong></p>
  <p>框架名字是一个可选参数.<br />
  控件名字为select控件的name属性.<br />
  <br />
  而查找参数可以指定选项数组的索引,选项数组是com对象,第一个元素的索引为0<br />
  如果查找参数是一个字符串,则该函数遍历所有选项,查找选项值或选项文本等于该参数的选项.<br />
  找到选项以后,将该选项置为选中状态,如果select控件指定了onchange事件,则自动触发该事件.<br />
  最后返回该节点对象.<br />
  <br />
  </p>
</div>
<div>
  <h2>完整示例</h2>
  <p>下面是一个完整示例,演示了控制选项控件的方法.<br />
  </p>
<pre>import win.ui;
/*DSG{{*/
var winform = win.form(min=1;scroll=1;bottom=249;max=1;text="AAuto Form";right=349 )
winform.add(  )
/*}}*/

import web.form;

//创建web窗体
var wb = web.form( winform 
	,//可输入_UIFLAG_ 前缀的常量自定义外观
	,//可输入_DLCTL_ 前缀的常量以控制下载行为
	);
 

html = /*
&lt;input type=&quot;radio&quot; name=&quot;radio&quot; id=&quot;radio&quot; value=&quot;radio&quot; /&gt;
&lt;input type=&quot;radio&quot; name=&quot;radio&quot; id=&quot;radio2&quot; value=&quot;radio2&quot; /&gt;
&lt;input type=&quot;checkbox&quot; name=&quot;checkbox&quot; id=&quot;checkbox&quot; /&gt;
&lt;select name=&quot;select&quot; id=&quot;select&quot; onchange=&quot;alert('我被改变了')&quot;&gt;
  &lt;option value=&quot;值&quot;&gt;选项&lt;/option&gt;
  &lt;option value=&quot;值2&quot;&gt;选项2&lt;/option&gt;
&lt;/select&gt;
 */

wb.write(html)
winform.show()

//单选框
ele = wb.getEles("radio")
ele(0).checked = true;

//复选框
ele = wb.getEle("checkbox")
ele.checked = true;

//下拉选框
wb.select("select","值2"); //参数二可以是索引,也可以是选项的值,或者选项的显示文本

//下拉选框
ele = wb.select("select",1) //此函数返回选项节点对象 


//进入消息循环
win.loopMessage();
return wb,winform;
</pre>
  <p>&nbsp;</p>
</div>
</div></body>
</html>